<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2018-09-26
  Time: 16:25
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
    <title>首页</title>
</head>
<body style="text-align: center;" >
    <h1>空气质量信息监测库</h1>
    <form id="airForm" action="/index" method="get">
        <input id="currentPage" type="hidden" name="currentPage" value="1"/>
        按区域查询
        <select name="districtId">
            <option value>不限</option>
            <c:forEach items="${districtList}" var="d">
                <option <c:if test="${districtId == d.id}">selected</c:if> value="${d.id}">${d.name}</option>
            </c:forEach>
        </select>
        ${districtId}
        <button type="submit">查找</button>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <a href="${pageContext.request.contextPath}/air/toAdd">添加空气质量信息</a>
    </form>
    <c:choose>
        <c:when test="${pageBean.totalCount==0}">
            <!--没数据-->
            <h2>抱歉，暂无数据</h2>
        </c:when>
        <c:otherwise>
            <!--有数据-->
            <table style="margin: auto;" border="1px solid">
                <tr>
                    <th>序号</th>
                    <th>区域</th>
                    <th>监测时间</th>
                    <th>PM10 数据</th>
                    <th>PM2.5 数据</th>
                    <th>监测站</th>
                </tr>
                <c:forEach items="${pageBean.list}" var="a" varStatus="i">
                    <tr>
                        <td>${i.index+1}</td>
                        <td>${a.dname}</td>
                        <td>
                            <fmt:formatDate value="${a.monitorTime}" pattern="yyyy-mm-dd"/>
                        </td>
                        <td>${a.pm10}</td>
                        <td>${a.pm25}</td>
                        <td>${a.monitoringStation}</td>
                    </tr>
                </c:forEach>
                <tr style="text-align: center;">
                    <td colspan="6">
                        <c:if test="${pageBean.currentPage>1}">
                            <a href="javascript:page(1)">首页</a> |
                            <a href="javascript:page(${pageBean.currentPage-1})">&lt;&lt;上一页</a> |
                        </c:if>
                        <c:if test="${pageBean.currentPage}<${pageBean.totalCount  }">
                            <a href="javascript:page(${pageBean.currentPage+1})">下一页&gt;&gt;</a> |
                            <a href="javascript:page(${pageBean.totalPage})">尾页</a>
                            第 ${pageBean.currentPage} 页 / 共 ${pageBean.totalPage} 页 (${pageBean.totalCount  } 条)
                        </c:if>
                    </td>
                </tr>
            </table>
        </c:otherwise>
    </c:choose>
        <script>
            function page(pageNum) {
               //给隐藏域设置值
                document.getElementById("currentPage").value=pageNum;
                //提交form表单
                document.getElementById("airForm").submit();
            }
        </script>

    <%--${districtList}
    <br />
    <br />
    <br />
    ${pageBean.currentPage}<br />
    ${pageBean.pageSize}<br />
    ${pageBean.totalCount}<br />
    ${pageBean.totalPage}<br />
    ${pageBean.list}--%>
</body>
</html>
